<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../../plugins/mui/mui.min.css" rel="stylesheet"/>
		<link href="../../css/literary/venue.css" rel="stylesheet"/>
		<link href="../../css/style.css" rel="stylesheet"/>
		<script src="../../js/statistics.js"></script>
	</head>
	<style type="text/css">
		.body{
			margin-top: 56px;
		}
	</style>
	<body>
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">文体协会</h1>
		</header>
		<div class='search clear'>
			<div class="mui-input-row mui-search">
    			<input type="search" class="mui-input-clear input_click" placeholder="搜索">	
			</div>
			<span class='s_click ' style='display:none;'>取消</span>
		</div>
    	<!--搜索弹出框-->
		<div class='modal_search' style='display:none;'>
			<!--列表：你的搜索信息-->
			<!--<ul class='mui-table-view' class="search-list">
			</ul>	-->
			
		</div>
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
			<div class="body mui-scroll">
				<ul>
				</ul>
			</div>
		</div>
		<div class='kong'>
			<img src="../../images/my/index/null.png" alt="" />
		</div>
		<script src="../../plugins/template/template.js"></script>
		<script src="../../plugins/jquery/jquery-3.1.0.min.js"></script>
		<script src="../../plugins/mui/mui.min.js"></script>
		<script src="../../js/getApiToken.js"></script>
		<script src="../../js/fontset.js"></script>
		<script src="../../js/md5.js"></script>
		<script id="gym-list" type="text/html">
			{{each data as value i}}
			<li class="clear" onclick="goDetail({{value.id}},'文体协会','gym')">
				<div>
					<img src="{{baseUrl}}{{value.front_cover}}" />
				</div>
				<div>
					<p>{{value.name}}</p>
				</div>
			</li>
			{{/each}}
		</script>
		<script id="search-list" type="text/html">
			<ul class='mui-table-view' class="search-list">
				{{each data as value i}}
				<li class='mui-table-view-cell'  onclick="goDetail({{value.id}},'文体协会','gym')">{{value.name}}</li>
				{{/each}}	
			</ul>
		</script>
		<script>
			var first = 0,
				lastId;
			mui.init({
				pullRefresh : {
					container:"#refreshContainer",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
					up : {
						height:50,//可选.默认50.触发上拉加载拖动距离
						auto:false,//可选,默认false.自动上拉加载一次
						contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
						contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
						callback :function pullfresh() {
							if(true){
								myAjax('physical/Union/getlist', 'post', {
								 	'lastId':lastId,
								 	'total':6
								}, function(data) {
									if(data.code == 0){
										console.log(JSON.stringify(data))
										if(data.data.length == 0){
											mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
											
										}else{
											if(data.data.length < 6){
												mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
											}else{
												mui('#refreshContainer').pullRefresh().endPullupToRefresh(false);
											}
											loadMore(data.data);
											var length = data.data.length-1;
											lastId = data.data[length].id;
											console.log(lastId)
										}
									}else{
										mui.toast(data.error_msg);
									}
								})
							}
							first++;
		
						}
					}
				}
			});
			mui.plusReady(function(){
				//获取列表
				myAjax('physical/Union/getlist','get',{'total':8},function(data){
					console.log(JSON.stringify(data))
					if(data.code == 0){
						if(!data.data.length){
				 			$('.kong').show();
							mui('#refreshContainer').pullRefresh().disablePullupToRefresh();
				 		}else{
				 			var length = data.data.length-1;
							lastId=data.data[length].id;
							initList(data.data);
				 		}
					}
				});
				var nameProving = /[\u4E00-\u9FA5]*/;
				$(".input_click").keyup(function(){
					var content = $(this).val();
					if(nameProving.test(content) && content.length > 0){
						var wait_2 = plus.nativeUI.showWaiting('正在搜索中...');
						myAnotherAjax('physical/Union/getlist','post',{'search':content},function(data){
							if(data.code == 0){
								console.log(JSON.stringify(data))
								if(data.data.length > 0){
									searchList(data.data);
								}else{
									var html = '<div class="search-none">'+
													'<p>没有查询到“'+content+
													'”的相关内容</p>'+
													'<p>请重新搜索</p>'+
												'</div>';	
									$(".modal_search").html(html);
								}
								setTimeout(function(){
									wait_2.close();
								},1);
							}
						})
					} else if(content.length == 0){
						$(".modal_search").html('');
					}
				});
				//搜索功能
			})
			//列表初始化
			function initList(data){
				var list = {
					data:data,
					baseUrl:_baseUrl
				};
				var html = template('gym-list',list);
				$(".body").find('ul').empty().append(html);
			}
			//加载更多
			function loadMore(data){
				var list = {
					data:data,
					baseUrl:_baseUrl
				};
				var html = template('gym-list',list);
				$(".body").find('ul').append(html);
			}
			//搜索列表
			function searchList(data){
				var list = {
					data:data
				}
				var html = template('search-list',list);
				$(".modal_search").html(html);
			}
			//跳转详情
			function goDetail(id,title,type){
				mui.openWindow({
					url:'detail.html',
					id:'detai',
					extras:{
						detailId:id,
						detailTitle:title,
						detailType:type
					}
				})
			}
			$(function(){
				//选中搜索框：弹出搜索
				$('.mui-search').off('touchstart').on('touchstart tap',function(e){
					
					//强制调起输入法
					var Context = plus.android.importClass("android.content.Context");
		            var InputMethodManager = plus.android.importClass("android.view.inputmethod.InputMethodManager");
		            var main = plus.android.runtimeMainActivity();
		            var imm = main.getSystemService(Context.INPUT_METHOD_SERVICE);
		            imm.toggleSoftInput(0, InputMethodManager.SHOW_FORCED);
					console.log(777888)
					$('.mui-search').addClass('mui-search-click');
					$('.s_click').show();
					$('.modal_search').show();
					$(".kong").hide();
					$('.input_click').off('blur').focus();
					$("#refreshContainer").hide();
//					e.preventDefault();
				});
				//点击取消，返回原列表
				$('.s_click').on('touchstart',function(e){
					var length = $(".body").find('li').length;
					if(length == 0){
						$(".kong").show();
					}
					$('.mui-search').removeClass('mui-search-click');
					$('.modal_search').hide();
					$('.s_click').hide();
					$("#refreshContainer").show();
					//并且输入内容为空
					$('.input_click').val('');
					$('.input_click').blur();
					e.preventDefault();
				});
				//搜索框聚焦时清空
				$('.input_click').on('input',function(){
					var content = $(this).val();
					if(content.length == 0){
						$(".modal_search").html('');
					}
				});
				//搜索框失焦
				$('.input_click').blur(function(e){
					
					//强制收回键盘
					var Context = plus.android.importClass("android.content.Context");
		            var InputMethodManager = plus.android.importClass("android.view.inputmethod.InputMethodManager");
		            var main = plus.android.runtimeMainActivity();
		            var imm = main.getSystemService(Context.INPUT_METHOD_SERVICE);
		            imm.toggleSoftInput(InputMethodManager.SHOW_FORCED,0);
		            console.log(7777)
		            var length = $(".body").find('li').length;
					if(length == 0){
						$(".kong").show();
					}
					var content = $(this).val();
					if(content.length == 0){
						$('.mui-search').removeClass('mui-search-click');
						$('.modal_search').hide();
						$('.s_click').hide();
						$("#refreshContainer").show();
						$(".modal_search").html('');
						e.preventDefault();
					}
				});
			})
		</script>
    	
	</body>
</html>
